var EventDispatcher = require("./../utils/EventDispatcher.js");

/*
 * 元素基类
 */
function ElementBase(face) {
	//继承事件
	EventDispatcher.call(this);

	this.id = Design.utils.uuid();
	this.type = ""; //元素类型

	this.paper = Design.paper;
	this.element = null;
	this.matrix = null;
	this.predata = null;
	this.face = face;
}

/*
 * 继承Event原型
 */
ElementBase.prototype = new EventDispatcher();

/*
 * 初始化
 */
ElementBase.prototype.init = function() {

}

/*
 * 通过json创建元素
 */
ElementBase.prototype.super_setJson = function(data) {
	if(!data) data = {};
	this.predata = data;
	if(data.id){
		this.id = data.id;
	}
	var scalex = data.scalex || 1;
	var scaley = data.scaley || 1;
	var x = data.x || 0;
	var y = data.y || 0;
	var rotate = data.rotate || 0;
	var width = data.width || 0;
	var height = data.height || 0;
	var cx = width / 2;
	var cy = height / 2;
	
	var matrix = new Snap.Matrix();
	matrix.translate(x, y);
	matrix.rotate(rotate);
	matrix.scale(scalex, scaley);
	this.matrix = matrix;
	
	this.isdestroy = false;
}

/*
 * 将元素添加到容器
 */
ElementBase.prototype.appendToCon = function() {
	if(this.face && this.element) {
		if(this.type == "product"){
			if(this.designType == "0"){
				this.element.appendTo(this.face.productBg);
			}else{
				this.element.appendTo(this.face.productFg);
			}
		}else{
			this.element.appendTo(this.face.eleCon);
		}
		this.element.node.setAttribute("displayType", "Element");
		this.element.transform(this.matrix);
	}
}

/*
 * 创建完成
 * 注册点击事件
 */
ElementBase.prototype.createEnd = function() {
	if(this.element) {
		var self = this;
		this.element.mousedown(function(e) {
			self.element.mousedownEvent = e;
			self.select.call(self);
		});

		this.trigger(Design.event.ELEMENT_CREATED, this);
		setTimeout(function(){
			Design.event.trigger(Design.event.ICON_UPDATE, self);
		},0);
		if(this.predata.needSelect){
			this.select();
		}
	}
}

/*
 * 获取保存的数据
 */
ElementBase.prototype.super_getSaveData = function() {
	var self = this;
	var attrs = this.getElementAttrs();
	var json = {
		id: self.id,
		type: self.type,
		x: attrs.x,
		y: attrs.y,
		scalex: attrs.scalex,
		scaley: attrs.scaley,
		rotate: attrs.rotate,
		width: attrs.width,
		height: attrs.height
	}

	return json;
}

/*
 * 根据变换或者元素属性
 */
ElementBase.prototype.getElementAttrs = function() {
	var attr = {
		x: 0,
		y: 0,
		scalex: 1,
		scaley: 1,
		rotation: 0,
		width: 0,
		height: 0
	}
	if(this.element) {
		var eleAttr = this.element.attr();
		eleAttr.x = eleAttr.x ? eleAttr.x : 0;
		eleAttr.y = eleAttr.y ? eleAttr.y : 0;
		eleAttr.w = eleAttr.w ? eleAttr.w : 0;
		eleAttr.h = eleAttr.h ? eleAttr.h : 0;
		var obj = this.element.matrix.split();
		attr.x = parseInt(eleAttr.x) + obj.dx;
		attr.y = parseInt(eleAttr.y) + obj.dy;
		attr.scalex = obj.scalex;
		attr.scaley = obj.scaley;
		attr.rotate = obj.rotate;
		attr.width = eleAttr.w;
		attr.height = eleAttr.h;
	}

	return attr;
}

/*
 * 选中
 */
ElementBase.prototype.select = function() {
	Design.tool.setTarget(this);
	Design.view.bind(this);
	Design.view.layer.select(this);
}

/*
 * 取消选中
 */
ElementBase.prototype.unselect = function() {
	Design.view.unbind(this);
	Design.view.layer.unselect(this);
}

/*
 * 更新
 */
ElementBase.prototype.update = function() {
	
}

/*
 * 下移一层
 */
ElementBase.prototype.downlayer = function() {
	var elements = this.face.elementList;
	var index = elements.getIndexByKey(this.id);
	if(index > 0) {
		var preInd = index - 1;
		var preEle = elements.getValueAt(preInd);
		elements.remove(this.id);
		elements.pushAt(this.id, this, preInd);
		this.updateLayer();
		Design.event.trigger(Design.event.ICON_UPDATE, this);
	}
}

/*
 * 上移一层
 */
ElementBase.prototype.uplayer = function() {
	var elements = this.face.elementList;
	var index = elements.getIndexByKey(this.id);
	var len = elements.getLength();
	if(index < len - 1) {
		var nextInd = index + 1;
		elements.remove(this.id);
		elements.pushAt(this.id, this, nextInd);
		this.updateLayer();
		Design.event.trigger(Design.event.ICON_UPDATE, this);
	}
}

/*
 * 背景层
 */
ElementBase.prototype.bglayer = function() {
	var elements = this.face.elementList;
	elements.remove(this.id);
	elements.pushAt(this.id, this, 0);
	this.updateLayer();
	Design.event.trigger(Design.event.ICON_UPDATE, this);
}

/*
 * 产品层
 */
ElementBase.prototype.productlayer = function(designType) {
	var elements = this.face.elementList;
	elements.remove(this.id);
	if(designType == 0){
		elements.pushAt(this.id, this, 0);
	}else{
		elements.pushAt(this.id, this, 10000);
	}
	
	this.updateLayer();
	Design.event.trigger(Design.event.ICON_UPDATE, this);
}

/* 更新图层 */
ElementBase.prototype.updateLayer = function(){
	var currFace = this.face;
	var elements = currFace.elementList;
	for (var i = 0; i < elements.length; i++) {
		var ele = elements.getValueAt(i);
		if(ele.type != "product"){
			ele.appendToCon();
		}
	}
}

/*
 * 水平居中
 */
ElementBase.prototype.centerHorizontally = function(){
	var bbox = this.element.getBBox();
	var editBox = Design.mainEditer.getEditeRect();
	var dx = (editBox.w - bbox.w)/2;
	var dy = (editBox.h - bbox.h)/2;
	var tx = editBox.x + dx;
	// var ty = editBox.y + dy;
	
	var matrix = this.element.matrix;
	matrix.e = tx;
	// matrix.f = ty;
	this.element.transform(matrix);
	Design.tool.setTarget(this);
	Design.tool.update();
}

/*
 * 顺时针旋转 deg 度
 */
ElementBase.prototype.rotation = function(deg){
	if(deg == undefined){
		deg = 45;
	}
	var bbox = this.element.getBBox(true);
	var matrix = this.element.matrix;
	matrix.rotate(deg,bbox.w/2, bbox.h/2);
	this.element.transform(matrix);
	Design.tool.setTarget(this);
	Design.tool.update();
}

/*
 * 拷贝
 */
ElementBase.prototype.copy = function(){
	var data = this.getSaveData();
	data.id = Design.utils.uuid();
	data.x += 50;
	data.y += 50;
	data.needSelect = true;
	Design.event.trigger(Design.event.ADD_ELEMENT, data);
}

/*
 * 最大化
 * par: v 水平最大化, h 垂直最大化, 默认  水平和垂直最大化
 */
ElementBase.prototype.toMax = function(par){
	var newMatrix =this.element.matrix;
	var bbox = this.element.getBBox();
	var editBox = Design.mainEditer.getEditeRect();
	var scalex = editBox.w / bbox.w;
	var scaley = editBox.h / bbox.h;
	switch (par){
		case "v":
			newMatrix.scale(scalex, scalex);
			break;
		case "h":
			newMatrix.scale(scaley, scaley);
			break;
		default:
			var ts = scalex>scaley?scalex:scaley;
			newMatrix.scale(ts, ts);
			break;
	}
	
	this.element.transform(newMatrix);
	bbox = this.element.getBBox();
	var dx = (editBox.w - bbox.w)/2;
	var dy = (editBox.h - bbox.h)/2;
	var tx = editBox.x + dx;
	var ty = editBox.y + dy;
	newMatrix.e = tx;
	newMatrix.f = ty;
	
	this.element.transform(newMatrix);
	Design.tool.setTarget(this);
	Design.tool.update();
}

/*
 * 加载图片
 */
ElementBase.prototype.loadImg = function(url,callBack){
	var self = this;
	var index = layer.load();
	var img = new Image();
	img.onload = function(){
		var canvas = document.createElement("canvas");
		canvas.width = img.width;
		canvas.height = img.height;
		canvas.getContext("2d").drawImage(img,0,0);
		var dataurl = canvas.toDataURL();
		callBack(img, dataurl);
		layer.close(index);
	}
	if(config_gl.apiPath.indexOf("http://127.0.0.1:8086/api") != -1){
		url = url.replace("http://47.106.65.176/image","http://127.0.0.1:8086/image");
	}
	img.src = url;
}

/*
 * 获取缩略图
 */
ElementBase.prototype.getIcon = function(){
	
}

//隐藏
ElementBase.prototype.hide = function() {
	if(this.element) {
		this.element.attr("display", "none");
	}
	var currele = Design.tool.getTarget();
	if(this == currele){
		Design.tool.setTarget(null);
	}
}

//显示
ElementBase.prototype.show = function() {
	if(this.element) {
		this.element.attr("display", "");
	}
}

//销毁
ElementBase.prototype.destroy = function() {
	var currele = Design.tool.getTarget();
	if(this == currele){
		Design.tool.setTarget(null);
	}
	this.unselect();
	if(this.element) {
		this.element.remove();
		this.element = null;
	}
}

exports = module.exports = ElementBase;